<template>
    <div class="body">
        <div class="hg_newbox">
            <div class="hg_newboxrig">
                <div class="hg_newboxr_wrap">
                    <div class="hg_nbrw_top">
                        <i></i>
                        <span>采购中标情况通报</span>
                        <i></i>
                    </div>
                    <div class="hg_boxlist">
                        <a
                            v-for="(item, index) in dataList"
                            :key="index"
                            @click="
                                turnBlank(2, {
                                    typeId: item.typeId,
                                    id: item.id,
                                })
                            "
                        >
                            <div>
                                <i></i>
                                <span>{{ item.name }}</span>
                            </div>
                            <div>
                                <b>{{ item.publishTime }}</b>
                            </div>
                        </a>
                        <h1>
                            <span
                                @click="
                                    turnBlank(1, {
                                        categoryId: '3403201104439301156',
                                    })
                                "
                                >更多>></span
                            >
                        </h1>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import appUtil from '~/assets/utils/appUtil';
import { createNamespacedHelpers } from 'vuex';
const { mapActions } = createNamespacedHelpers('hgModule');
export default {
    name: 'test',
    data() {
        return {
            dataList: [],
            icur: '3403201104439301156',
            title: '采购中标情况通报',
        };
    },
    mounted() {
        this.getdataList(1, 4, '3403201104439301156');
    },
    methods: {
        ...mapActions(['getdataListsAsync']),
        turnBlank(type, Parameters) {
            appUtil.routerUrl(type, Parameters, this.title, this.icur);
        },
        getdataList(pn, ps, categoryId) {
            this.getdataListsAsync({
                pn,
                ps,
                categoryId,
            }).then((res) => {
                this.dataList = res.data.dataList;
                for (let i = 0; i < this.dataList.length; i++) {
                    if (this.dataList[i].cmsArticle) {
                        this.dataList[
                            i
                        ].cmsArticle.content = appUtil.strIntercept(
                            this.dataList[i].cmsArticle.content
                        );
                    }
                }
            });
        },
    },
};
</script>

<style lang="scss" scoped>
.body {
    overflow: hidden;
}
.hg_newbox {
    width: 100%;

    .hg_newboxrig {
        float: right;
        background: #fff;
        width: 100%;

        .hg_newboxrigimg {
            margin: 0 auto;
            display: block;
            margin-top: 5px;
        }

        .hg_newboxr_wrap {
            margin: 0 auto;
            border: 1px solid #2c8bff;
            margin-top: 5px;
        }

        .hg_nbrw_ul {
            width: 100%;
            height: 100%;
            padding: 0 10px;

            li {
                float: left;
                text-align: center;
                padding: 0 42px;

                p {
                    font-size: 14px;
                    font-weight: 400;
                    color: #094194;
                    margin-top: 14px;
                }

                img {
                    margin-top: 22px;
                }
            }
        }

        .hg_nbrw_top {
            height: 30px;
            background: #094194
                linear-gradient(180deg, #0089ff 0%, #032795 100%);
            border-radius: 1px;
            text-align: center;
            line-height: 30px;

            span {
                font-size: 14px;
                font-weight: 400;
                color: #ffffff;
                margin: 0 10px;
            }

            i {
                display: inline-block;
                width: 4px;
                height: 4px;
                background: #ffffff;
                border-radius: 2px;
            }
        }
    }

    .hg_boxlist {
        padding: 0 20px;

        h1 {
            height: 20px;
            padding-bottom: 10px;
            cursor: pointer;

            span {
                font-size: 12px;
                font-weight: 400;
                color: #999999;
                float: right;
            }
        }

        a {
            width: 100%;
            display: inline-block;
            border-bottom: 1px solid #eaeaea;
            line-height: 24px;
            margin: 4px 0;
            padding: 6px 0 12px 0;
            cursor: pointer;

            i {
                float: left;
                width: 4px;
                height: 4px;
                background: #999999;
                border-radius: 2px;
                margin: 10px 10px 0 5px;
            }

            span {
                float: left;
                font-size: 14px;
                font-weight: 400;
                color: #333333;
                max-width: 90%;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }

            b {
                float: left;
                font-size: 12px;
                font-weight: 400;
                color: #999999;
                margin-right: 20px;
                margin-left: 18px;
                cursor: pointer;
            }
        }
    }
}
</style>
